<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>修改学生信息</title>
    <script src="/js/jquery-3.3.1.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="/js/vuejs-2.5.16.js"></script>
    <script src="/js/axios-0.18.0.js"></script>
    <script type="text/javascript">
        $(function () {
            var vue = new Vue({
                    el: "#editForm",
                    data:{
                        student:{
                            id:0,
                            name:"",
                            password:"",
                            age:0,
                            sex:'',
                            birthday:"",
                            address:""
                        }
                    },
                    methods:{
                        //根据id查询学生信息
                        findById:function(){
                            let _this = this;
                            axios.get("/student/findOne",{params:{
                                id:getParameter("id")
                                }}).then(function (response) {
                                _this.student = response.data;
                            });

                        },
                        //跟新学生信息
                        update:function () {
                            let _this = this;
                            axios.post("/student/edit", _this.student).then(function (response) {
                                if (response.data===true){
                                    if(confirm("修改成功！返回首页")){
                                        location.href = "/index_vue.html";
                                    }
                                }else {
                                    alert("修改失败")
                                }
                            });
                        }
                    },
                    created:function() {
                        this.findById();
                    }
                },
            );

            /* $("#editForm").submit(function () {
                 $.post("/student/edit", $(this).serialize(), function (data) {
                     if (data === true) {
                         if(confirm("修改成功！返回首页")){
                             location.href = "/index.html";
                         }
                     } else {
                         alert("修改失败")
                     }
                 });
                 return false;
             });*/
        });
    </script>
</head>
<body>
<form @submit.prevent id="editForm">
    <table>
        <tr>
            <td></td>
            <td><input type="hidden" id="id" name="id" v-model="student.id"/></td>
            <td></td>
        </tr>
        <tr>
            <td> 姓名:</td>
            <td><input name="name" id="name" type="text" v-model="student.name"></td>
            <td></td>
        </tr>
        <tr>
            <td> 密码:</td>
            <td><input name="password" id="password" type="password" v-model="student.password"></td>
            <td></td>
        </tr>
        <tr>
            <td> 年龄:</td>
            <td><input name="age" id="age" type="text" v-model="student.age"></td>
            <td></td>
        </tr>
        <tr>
            <td> 性别:</td>
            <td><input name="sex" id="sex" type="text" v-model="student.sex"></td>
            <td></td>
        </tr>
        <tr>
            <td> 生日:</td>
            <td><input name="birthday" id="birthday" type="date"
                       value=<fmt:formatDate v-model='student.birthday' pattern='yyyy-MM-dd'/>
            </td>
            <td></td>
        </tr>
        <tr>
            <td> 地址:</td>
            <td><input name="address" id="address" type="text" v-model="student.address"></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td><input type="submit" @click="update(student)" value="修改"></td>
            <td><a href="javascript:history.go(-1)">返回</a></td>
        </tr>
    </table>
</form>

</body>
</html>